<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>RIP演示</title>

    <style>
        table {
            border-collapse: collapse;
        }

        table, td, th {
            border: 1px solid black;
            text-align: center;
        }

        .bg {
            background: url("<?php echo $src; ?>");
            background-size: 1000px 600px;
            background-repeat: no-repeat;
            width: 100%;
            height: 800px;
        }

        .ftable1 {
            padding-left: 170px;
            float: left;
            padding-top: 200px;
        }

        .ftable2 {
            padding-left: 250px;
            float: left;
           padding-top: 10px;
        }

        .ftable3 {
            padding-left: 20px;
            float: left;
            padding-top: 20px;
        }

        .fixed_div2{
            position:absolute;
            top:460px;
        }

        .fixed_div3{
            position:absolute;
            left: 180px;
            top:630px;
        }

        .fixed_hr{
            position:absolute;
            height:10px;border:none;border-top:10px groove skyblue;
            top:620px;
        }

        .button{
            display: inline-block;
            color: #FFFFFF;
            background-color: #8AC007;
            font-weight: bold;
            font-size: 12px;
            text-align: center;
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 3px;
            padding-bottom: 4px;
            text-decoration: none;
            margin-left: 5px;
            margin-top: 0px;
            margin-bottom: 5px;
            border: 1px solid #aaaaaa;
            border-radius: 5px;
            white-space: nowrap;
        }
    </style>
</head>
<body>
<div class="bg" id="main">

    <div>
        <div>
            <input type="button" name="button1"  value="清空" class='button' onclick="showMessage()"/>
            <input type="button" name="button2"  value="自定义" class='button' onclick="input()"/>
        </div>
        <div class="ftable1">
            <table>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                <?php foreach($routers_table['R5'] as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>
        <div class="ftable1">
            <table>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                <?php foreach($routers_table['R4'] as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                    <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>

        <div class="ftable1">
            <table>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                <?php foreach($routers_table['R3'] as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                    <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>
    </div>


    <div class="fixed_div2">
        <div class="ftable2">
            <table>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                 <?php foreach($routers_table['R1'] as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                    <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>


        <div class="ftable2">
            <table>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                <?php foreach($routers_table['R2'] as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                    <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>

        <br/>
    </div>
    <div>
        <br/>
        <hr class="fixed_hr" style="color:red;width:100%;">
    </div>

    <?php if(isset($Rs)){?>
    <div class="fixed_div3">
        <div class="ftable3">
            <table>
                <caption>R<?php echo $Rsi; ?></caption>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                <?php foreach($Rs as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                    <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>

        <div class="ftable3">
            -->
        </div>

        <div class="ftable3">
            <table>
                <caption>中间表R<?php echo $Rsi; ?></caption>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                <?php foreach($Rt as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                    <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>

        <div class="ftable3">
            +

        </div>

        <div class="ftable3">
            <table>
                <caption>更新前R<?php echo $Rdi; ?></caption>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                <?php foreach($Rx as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                    <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>

        <div class="ftable3">
        ==>
        </div>

        <div class="ftable3">
            <table>
                <caption>更新后R<?php echo $Rdi; ?></caption>
                <tr>
                    <th>网络</th>
                    <th>下一跳</th>
                    <th>距离</th>
                </tr>
                <?php foreach($Rd as $row) {?>
                <?php if($row['F']==1){ ?>
                <tr style="color:red">
                    <?php }else{?>
                <tr>
                    <?php } ?>
                    <td><?php echo $row['N']; ?></td>
                    <td><?php echo $row['R']; ?></td>
                    <td><?php echo $row['D']; ?></td>
                </tr>
                <?php } ?>
            </table>
        </div>

    </div>

    <?php } ?>

</div>

<script>
    //2s刷新一次
    setTimeout(function(){
        var url=location.href;
        url= url.replace(/\?action=.*/i,"");
        window.location.href=url;
    },2000);

    function showMessage(){
        var url=location.href;
        url=url+"?action=clear";
        window.location.href=url;
    }

    function input(){
        var url=location.href;
        url= url.replace(/\?action=.*/i,"");
        url=url+"?action=input";
        window.location.href=url;
    }
</script>
</body>
</html>